<script type="text/x-template" id="mediaitem-scroller-horizontal-sp">
    <div class="cd-hmedia-scroller hmedia-scroller-card">
        <vue-horizontal>
            <template>
                <mediaitem-square kind="card" :item="item" size="300" :reasonShown="withReason" v-bind:key="item.id"
                                  v-for="item in items"></mediaitem-square>
            </template>
        </vue-horizontal>
    </div>
</script>

<script>
  Vue.component('mediaitem-scroller-horizontal-sp', {
    template: '#mediaitem-scroller-horizontal-sp',
    props: {
      'items': { type: Array, required: false },
      'withReason': { type: Boolean, required: false, default: false },
    },
    data: function() {
      return {
        app: this.$root,
      }
    },
    methods: {}
  });
</script>
